<style>

</style>
<template>
  <el-dialog
    title="配置一次性执行脚本"
    :visible.sync="dialogVisible"
    :close-on-press-escape="false"
    :close-on-click-modal="false"
    width="80%"
    :before-close="clearForm">

    <el-form
      :label-position="labelPosition"
      label-width="130px"
      :model="saveData"
      :rules="rules"
      ref="ruleForm"
    >
      <el-form-item label="选择项目" prop="appCode">
        <el-select
          :disabled="saveData.id && saveData.id !==''"
          v-model="saveData.appCode"
          placeholder="请选择项目">
          <el-option
            v-for="item in appOptions"
            :key="item.value"
            :label="item.label"
            :value="item.value">
          </el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="选择执行方式" prop="runnerType">
        <el-select
          v-model="saveData.runnerType"
          placeholder="请选择执行方式">
          <el-option
            v-for="item in disposableTypeOptions"
            :key="item.value"
            :label="item.label"
            :value="item.value">
          </el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="功能描述" prop="desc">
        <el-input placeholder="请输入功能秒速" rows="3" type="textarea" v-model="saveData.desc"></el-input>
      </el-form-item>
      <el-form-item label="执行脚本" prop="script">
        <el-input placeholder="请编写执行脚本(必须实现DisposableRunnerHandler接口)" rows="10" type="textarea" v-model="saveData.script"></el-input>
      </el-form-item>
    </el-form>

    <span slot="footer" class="dialog-footer">
    <el-button @click="clearForm">取 消</el-button>
    <el-button type="primary" @click="save">确 定</el-button>
  </span>
  </el-dialog>
</template>
<script>

import {appSelector} from "@/api/loadSelectorApi";
import {disposableSave} from "@/api/disposable";

export default {
  name: "disposableAddForm",
  filters: {},
  components: {},
  data() {
    return {
      remoteLoading: false,
      labelPosition: 'right',
      dialogVisible: false,
      appOptions: [],
      disposableTypeOptions: [
        {
          label: "单机",
          value: "stand-alone"
        }, {
          label: "集群",
          value: "colony"
        }
      ],
      saveData: {
        appCode: '',
        desc: '',
        runnerType: '',
        script: '',
      },
      rules: {
        appCode: [
          {required: true, message: '此项必填', trigger: 'change'}
        ],
        runnerType: [
          {required: true, message: '此项必填', trigger: 'change'}
        ],
        desc: [
          {required: true, message: '此项必填', trigger: 'blur'}
        ],
        script: [
          {required: true, message: '此项必填', trigger: 'blur'}
        ]
      }
    }
  },
  async created() {
    this.appOptions = await appSelector();
  },
  mounted() {
  },
  methods: {
    load(data) {
      let vm = this
      if (data) {
        vm.saveData = vm.$cloneObj(data)
      }
      vm.dialogVisible = true
    },
    save() {
      let vm = this
      this.$refs['ruleForm'].validate(async (valid) => {
        if (valid) {
          await vm.doSave(this.saveData)
        }
      })
    },
    async doSave(saveData) {
      let vm = this
      let ret = await disposableSave(saveData);
      if (ret.ok) {
        vm.$message({type: 'success', message: '保存成功'});
      } else {
        vm.$message({type: 'error', message: '保存失败：' + ret.message});
      }
      vm.clearForm()
      vm.$parent.query()
    },
    clearForm() {
      let vm = this
      try {
        vm.saveData = {
          appCode: '',
          desc: '',
          runnerType: '',
          script: '',
        }
        vm.$refs['ruleForm'].resetFields()
      } catch (e) {
        console.log(e)
      }
      vm.dialogVisible = false
    }
  }
}
</script>
